﻿<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<html>

	<head>
		<meta charset="utf-8" />
		<!-- 优先使用 IE 最新版本和 Chrome -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<!-- 为移动设备添加 viewport -->
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
		<!--忽略页面中的数字识别为电话，忽略email识别-->
		<meta name="format-detection" content="telphone=no, email=no" />
		<title>国际媒体话语分析平台-信息检索</title>
		<link rel="stylesheet" type="text/css" href="/css/bootstrap.css" />
		<link rel="stylesheet" type="text/css" href="/css/base.css" />
		<!--[if lt IE 9]>
			<script type="text/javascript" src="/js/html5shiv.min.js"></script>
			<script type="text/javascript" src="/js/respond.min.js"></script>
	    <![endif]-->
		<link rel="stylesheet" type="text/css" href="/css/media.css" />
	    <style type="text/css">
		.page-banner img{max-width:100%;}
		.glyphicon-heart{margin-left:20px;}
		.news-text{ margin:30px 0px;  border-bottom: 1px  dotted #dedede; padding-bottom: 10px;}
		.news-list a.read-all{ margin-right: 30px;}
	    </style>
		<link rel="stylesheet" type="text/css" href="css/media.css" />
		<link rel="stylesheet" type="text/css" href="/res/layui/css/layui.css">
	</head>

	<body>
		<!--导航-->
		<nav class="navbar navbar-default navbar-fixed-top top-box">
			<div class="container">
				<div class="navbar-header">
					<button type="button" class="navbar-toggle collapsed" >
				        <span class="sr-only">Toggle navigation</span>
				        <span class="icon-bar"></span>
				        <span class="icon-bar"></span>
				        <span class="icon-bar"></span>
				    </button>
					<h1><a class="navbar-brand" href="#">
						国际媒体话语分析平台
					</a></h1>
				</div>
			
				<div class="collapse navbar-collapse" >
					<ul class="nav navbar-nav navbar-right top-nav">
						<li>
							<a href="/page/index">
								平台首页
							</a>
						</li>
						<li>
							<a href="/page/new-news">最新资讯</a>
						</li>
						<li>
							<a href="/page/new-hot">热点推荐</a>
						</li>
						<li class="active">
							<a href="/page/new-search" >信息检索</a>
							<span class="sr-only">(current)</span>
						</li>
						<li class="search_c"><a href="#">搜索 <i class="glyphicon glyphicon-search"></i></a></li>
						<form>
							<input type="text" th:value="${schResult.getKeyword()}" id="keyword" name="keyword" class="form-control search" placeholder="请输入文章关键字或标题">
						</form>
					</ul>

				</div>
				<!-- /.navbar-collapse 导航结束 -->
			</div>
			<!-- /.container -->
		</nav>
		<!--/ 导航-->

		<!--广告图-->
		<div class="container-fluid page-banner">
			<div class="row">
				<img src="/img/4.jpg" alt="" class="img-responsive" />
			</div>
		</div>

		<!--文章列表 -->
		<div class="news">
			<div class="container">
				<div class="row">
					<div class="col-lg-3 col-md-3 col-sm-3 hidden-xs sidebar">
					   <span class="open">展开栏目列表</span>
						<!--电脑端页面导航-->
						<ul>
						<span title="关闭栏目列表" class="colse"></span>
							<li class="sidebar-title">
								<a href="/page/index">
									<h3>平台首页</h3>
									<p> INDEX </p>
								</a>
							</li>
							<li class="sidebar-item">
								<a href="/page/new-hot"><span class="glyphicon glyphicon-circle"></span>&nbsp;热点推荐</a>
							</li>
							<li class="sidebar-item">
								<a href="/page/new-news"><span class="glyphicon glyphicon-circle"></span>&nbsp;&nbsp;最新资讯</a>
							</li>
							<li class="sidebar-item">
								<a href="/data/import?name=search"><span class="glyphicon glyphicon-circle"></span>&nbsp;&nbsp;数据导出</a>
							</li>
						</ul>
					</div>
					<div class="col-lg-9 col-md-9 col-sm-9 col-xs-12 right-content">
						<!--手机端页面导航-->
						<div class="mobile-nav hidden-md hidden-sm hidden-lg">
							<div class="mobile-nav-title">
								<a href="/page/index">
									<h3>平台首页</h3>
									<p> INDEX </p>
								</a>
							</div>
							<div class="mobile-nav-item clearfix">
								<a href="/page/new-hot"><span class="glyphicon glyphicon-circle"></span>&nbsp;热点推荐</a>
								<a href="/page/new-news"><span class="glyphicon glyphicon-circle"></span>&nbsp;最新资讯</a>
								<a href="/data/import?name=search"><span class="glyphicon glyphicon-circle"></span>&nbsp;数据导出</a>
							</div>
						</div>
						<!--面包屑导航-->
						<ol class="breadcrumb bread">		
							<h4>搜索与<span class="active" th:text="${schResult.getKeyword()}"></span> 相关文章 <span class="active" th:text="${schResult.getCount()}"></span> 篇</h4>
						</ol>
						<div class="news-list">
								<div class="news-text" th:each="news : ${schResult.getNews()}">
									<h3><a th:href="'/page/new-con?id='+${news.getId()}" th:utext="${news.getTitle()}"></a></h3>
									<p>
										<a th:href="'/page/new-con?id='+${news.getId()}" th:utext="${news.getContent()}"></a>
									</p>
									<div>
										<a th:href="'/page/new-con?id='+${news.getId()}" class="read-all">阅读全文</a>
										<span><i class="glyphicon"></i>来源:</span>
										<span th:text="${news.getSource()}"><i class="glyphicon glyphicon-eye-open"></i></span>
										&nbsp;&nbsp;&nbsp;
										<span th:text="${news.getCountry()}"><i class="glyphicon glyphicon-eye-open"></i></span>&nbsp;&nbsp;&nbsp;
										<span><i class="glyphicon glyphicon-eye-open"></i>关键词:</span>
										<span class="" th:text="${news.getKeyword()}" style="color: #01AAED;font-size: 100%"><i class="glyphicon glyphicon-heart"></i> </span>
										<span class="pull-right" th:utext="${news.getTime()}"><i class="glyphicon glyphicon-time"></i> </span>
									</div>
								</div>
															<!--分页-->
								<nav aria-label="Page navigation" class="page-box">
									<div id="demo7" style="text-align: center; padding:30px 0"></div>
								</nav>
						</div>

					</div>
					
				</div>
			</div>
		</div>
		<div class="footer">
			国际化媒体话语分析平台
		</div>

	
		<script type="text/javascript" src="/js/jquery.js"></script>
		<script type="text/javascript" src="/js/bootstrap.js"></script>
		<script type="text/javascript" src="/js/nav.js"></script>
		<script type="text/javascript" src="/js/search.js"></script>
		<script type="text/javascript" src="/res/layui/layui.js"></script>
		<script th:inline="javascript">
			layui.use(['laypage', 'layer'], function () {
				var laypage = layui.laypage
						, layer = layui.layer;
				var limitnum = [[${schResult.getLimit()}]];
				var pagenum = [[${schResult.getPage()}]];
				var countnum = [[${schResult.getCount()}]];

				//完整功能
				laypage.render({
					elem: 'demo7'
					, count: countnum
					, limit: limitnum
					, curr: pagenum
					, layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
					, jump: function (obj, first) {
						console.log(obj)
						//obj包含了当前分页的所有参数，比如：
						console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
						console.log(obj.limit); //得到每页显示的条数
						//首次不执行
						//do something
						if (!first) {
							var keyword = document.getElementById("keyword").value;
							var href = '/page/new-search?keyword=' + keyword;
							href += '&page=' + obj.curr;
							href += '&limit=' + obj.limit;
							window.location.href = href
						}
					}
				});

			});
		</script>
	</body>

</html>